import { Button, DatePicker, Form, Input, message } from 'antd';

import React from 'react';
import { useLocation, useNavigate } from 'react-router-dom';

import PropsType from '../model/ReactSys';
import { Biz1State } from '../model/BizState';
import TransInfoForm from './TransInfo';


class NormalLoginForm extends React.Component<PropsType, Biz1State> {

    // constructor(props: PropsType) {  // 这种写法也可以
    constructor(props: any) {
        super(props)
        this.state = {
            content: '',
            str2: '888-888'
        }
    }

    componentDidMount() {
    }

    onClick = () => {
        console.info("-------------------")
    }
    onClick2 = () => {
        console.info("2222222222222222")
    }

    onContentChange = (e: any) => { // 为了预览
        let content = e.target.value
        // let str2 = e.target.value
        this.setState({ content })
    }

    onCallback = () => {
        message.success("OK 222!!!")
    }

    render() {
        return (
            <div>
                <Input onChange={this.onContentChange}></Input>

                <Button onClick={this.onClick} type="primary"> 测试 </Button>

                <DatePicker placeholder="选择日期" />
                <br />
                <br />
                <br />

                <TransInfoForm
                    content={this.state.content} str2={this.state.str2} callBack={this.onCallback}
                    component={
                        <div>
                            <b> test </b>
                            <Button onClick={this.onClick2} type="primary"> 测试2 </Button>
                        </div>
                    }
                />
            </div>
        )
    }
}

// export default NormalLoginForm   // 直接这样 export 获取不到路由参数
function WithNavigate(props: any) {
    let navigate = useNavigate();   // 用作组件返回时才有用
    let location = useLocation();
    let [form] = Form.useForm();
    return <NormalLoginForm {...props} navigate={navigate} location={location} form={form} />
}
export default WithNavigate         // 封装下 export 才能获取路由参数


// props 传值测试